<!--
基本信息--使用elelmentuiplus
-->

<template>
  <div>

    <div>
      <t-table
          :title="title"
          :table="state.table"
          :columns="state.table.columns"
          :isShowPagination="false"
          ref="singleEdit"
          :listTypeInfo="state.listTypeInfo"
          @handleEvent="handleEvent"
          @validateError="validateError"
      >
        <template #TermID="{ scope }">
          <el-select
              v-model="scope.row[scope.column.property]"
              filterable
              remote
              reserve-keyword
              :placeholder="'请选择'+title"
              remote-show-suffix
              @change="(e) => updateZfTk(e, scope.row)"
              style="width: 100%"
          >
            <el-option
                v-for="item in state.listTypeInfo"
                :key="item.Id"
                :label="item.Content"
                :value="item.Id"
            >
            </el-option>
          </el-select>
        </template>
        <template #uploadFile1="{ scope }">
          <upload :limit="1" v-model="scope.row[scope.column.property]"></upload>
        </template>
        <template #uploadFile2="{ scope }">
          <upload :limit="1" v-model="scope.row[scope.column.property]"></upload>
        </template>
        <template #uploadFile3="{ scope }">
          <upload :limit="1" v-model="scope.row[scope.column.property]"></upload>
        </template>
      </t-table>
    </div>

  </div>
</template>

<script setup>
import {onMounted, ref, toRefs, watch} from "vue";
import {cubasdocStore} from "@/stores/modules/cubasdoc";
import {GetTK} from "@/api/base";
import {debounce} from "@/utils/util";
import {checkFildsStore} from "@/stores/modules/checkFilds";
const emit = defineEmits(['submit'])
defineOptions({ name: 'EntryBaseInfo' })
const props = defineProps({
  Trem: {
    type: Array,
    default: () => {
      return []
    }
  },
  Id:{
    type: String,
    default: ''
  },
  title:{
    type: String,
    default: ''
  }
})

let {
  Trem,
  Id,
  title
} = toRefs(props)


const singleEdit = ref(null)

// 编辑单元格监听事件
const handleEvent = (type, val, index) => {

}
// 重置表单
const reset = () => {
  singleEdit.value.resetFields()
}
const editDel = (item, index, row) => {
  //
  row.splice(index, 1)

}
// 错误校验提示
const validateError = list => {
  list.map(val => {
    setTimeout(() => {
      ElMessage.error(`${title.value}是必填项！`)
      checkFild.setData(val)
    }, 100)
  })
}

//定义数据
const state = reactive({
  loading:false,
  table: {
    border: true,
    rules: {
      TermContent: [{ required: true, message: "请选择条款", trigger: "blur" }],
      TermID: [{ required: true, message: "请选择条款", trigger: "blur" }]
    },
    // firstColumn: { type: "index", label: "序列" }, // 显示序列号
    data: [],
    columns: [
      {
        prop: "LineNum",
        label: "序号",
        width: "60",
      },{
        prop: "TermID",
        label: "条款",
        placeholder: "请选择条款",
        width: "200",
      },
      {
        prop: "TermContent",
        label: "条款内容",
        minWidth: "220",
      },

      {
        prop: "File1",
        label: "附件一",
      },
      {
        prop: "File2",
        label: "附件二",
        minWidth: "100",
      },
      {
        prop: "File3",
        label: "附件三",
        minWidth: "100",
      },
    ],
  },
  // 下拉选择项
  listTypeInfo: {},
})



const cubasdoc = cubasdocStore()
const checkFild = checkFildsStore()

//实时更新同步数据
watch(() => props.Trem, (newValue, oldValue) => {

      state.table.data = newValue
    }, { deep: true },
)


onMounted(() => {
  state.table.data = Trem.value

  getTermContent()
})

//获取条款内容
const getTermContent = debounce(async (data) => {

  let {Data} =  await GetTK({Code: props.Id,Name:''});
  state.listTypeInfo = Data

},false,300)

//支付条件选择
function updateZfTk(e,row){
  let zftk = state.listTypeInfo.filter((its) => {
    return (its.Id.toLowerCase().includes(e.toLowerCase()))
  })[0]
  if (zftk){
    //赋值
    row.TermContent = zftk.Content
  }
}


function  addOneTable () {
  state.table.data.push({
    //获取最大行号加1
    LineNum: state.table.data.length + 1,
    TermID: null,
    TermContent: null,
    File1: null,
    File2: null,
    File3: null,
  })
}

let resultArr = ref([])
// 清除校验规则
const validateTable = () => {
  singleEdit.value.saveMethod(data => {

  })
}

defineExpose({validateTable})

</script>

<style scoped lang="scss">

</style>
